import React from 'react';
import { connect } from 'dva';
import { createForm } from 'rc-form';
import { List, Icon, TextareaItem } from 'antd-mobile';
import styles from './withdrawCash.css';
import content from '../../../../../common/contentCss/content.css';
import CustTitle from '../../../../../common/title/title';
import { ToastTips } from '../../../../../../../common/toastTips/tosat';
import FootBtn from './footBtn/footBtn';
import fmoney from '../../../../../../../framework/utils/fmoney';

import moneyBagIcon from '../../../../../../../icons/partTimeDetail/money-bag-icon.png';

const WithdrawCash = ({
  money=0,
  onSubmit=()=>{},
  goBack,
  form: { getFieldProps, getFieldsValue, validateFields },
}) => {

  const titleProps = {
    titleName:'提现',
    goBack(){
      goBack();
    },
    showSaveBtnStatus:false,
    saveBtnName:'发送',
    onSave() {

    },
  }
  const validData = () => {
    validateFields((error, value) => {
      // console.log(error, value);
      if (error) {
        for (var i in error) {
          error[i].errors.map(e => ToastTips(e.message, 1500, null))
        }
        return;
      }

      if(value.amount >= 20){
        // console.log('value', JSON.stringify(value))
        onSubmit(value)
      }else{
        ToastTips('提现的金额不得少于20', 1500, null);
      }


    });
  }

  const footProps = {
    isOnClick:money && money >= 20 ? true : false,
    onOk(){
      console.log('确认提现');
      validData()
    },
  }

  return (
    <div className={content.content}>

      <CustTitle {...titleProps}/>
      <div style={{
        marginTop: '2.9em',
        marginBottom:'3.375em'
      }}>
      </div>
      <div className={styles.withdrawCashBody}>
        <div className={styles.title}>
          <span>提现金额</span>
          <span>余额 {money ? fmoney(money, 2) : '0.00'}</span>
        </div>

        <div className={styles.inputBody}>
          <img src={moneyBagIcon}/>
          <input type='number'
            className={styles.subCount}
            placeholder="输入提现金额, 最低20.00"
            {...getFieldProps('amount',{
              rules: [
                { required: true, message: '请输入您要提现的金额' }
              ]
            })}
          />
        </div>

      </div>

      <div className={styles.foot}>
        <FootBtn {...footProps}/>
      </div>

    </div>
  )
}


WithdrawCash.propTypes = {
};

export default createForm()(WithdrawCash);
